<template>
  <!-- #ifdef MP-WEIXIN -->
  <view>
    <view class="main" v-if="isCanUse">
      <view class="warp">
        <view class="header">
<!--          <image mode="widthFix" :src="" />-->
        </view>
        <button
          class="nk-btn"
          type="primary"
          open-type="getUserInfo"
          @getuserinfo="btnLogin"
        >
          授权登录
        </button>
        <view class="nk-btn btn-text">
            <text @tap="navigateBack">暂不登录</text>
        </view>
        <view class="login_tip" >
          授权登录即表示同意
<!--          <navigator url="/pages/">《平远会员用户协议》</navigator>-->
        </view>
      </view>
    </view>
  </view>
  <!-- #endif -->
</template>

<script>
import { info } from "@/store/modules/user";
import { gotoPage } from "@/common/js/utils";
export default {
  data() {
    return {
      $staticImg: this.$staticImg,
      config: {
        isNavigateBack: true
      },
      scrollTop: 0, // 当linear为true的时候需要通过onpagescroll传递参数
      SessionKey: "",
      OpenId: "",
      isCanUse: false,
      gotoUrl: null
    };
  },
  methods: {
    navigateBack() {

    },

    reset() {
      uni.hideLoading();
      this.isCanUse = true;
    },

    btnLogin: function(e) {
      if (e.detail.userInfo) {
        this.login();
      } else {
        //用户按了拒绝按钮
        uni.showModal({
          title: "提示",
          content: "您点击了拒绝授权，将无法进入小程序，请授权之后再进入!",
          showCancel: false,
          confirmText: "返回授权",
          success: function(res) {
            if (res.confirm) {
              console.log("用户点击了“返回授权”");
            }
          }
        });
      }
    },

    login() {
      uni.showLoading({ title: "正在登录" });
      let that = this;
      uni.login({
        provider: "weixin",
        success: function(res) {
          console.log("login:", res);
          that.loginHanle(res.code);
        },
        fail() {
          that.reset();
        }
      });
    },

    loginHanle(code) {
      const that = this;
      uni.getUserInfo({
        provider: "weixin",
        success: function(infoRes) {
          try {
            uni.setStorageSync("isCanUse", false); //记录是否第一次授权  false:表示不是第一次授权
            uni.request({
              url: ``,
              data: {},
              success: rs => {

              },
              fail() {
                that.reset();
              }
            });
          } catch (e) {
            that.reset();
          }
        },
        fail(res) {
          console.log("fail");
          that.reset();
        }
      });
    }
  },
  onLoad(options) {
    let gotoUrl = options.gotoUrl || null;
    console.log("onLoad:", gotoUrl);
    if (gotoUrl) {
      this.gotoUrl = decodeURIComponent(gotoUrl);
    }
    const _this = this;

    this.isCanUse =
      uni.getStorageSync("isCanUse") === ""
        ? true
        : uni.getStorageSync("isCanUse");

    if (!this.isCanUse) {
      uni.showLoading();
      uni.checkSession({
        success() {
          //自动登录
          uni.hideLoading();
          _this.login();
        },
        fail() {
          _this.reset();
        }
      });
    }
  }
};
</script>

<style lang="scss">
page {
  height: 100%;
}
.main {
  display: flex;
  height: 100vh;
  align-items: center;
  justify-content: center;
  .warp {
    width: 100%;
  }
}

.header {
  margin-bottom: 240upx;
  text-align: center;
  image {
    width: 333upx;
    height: 100upx;
  }
}

.content {
  text-align: center;
  margin-bottom: 20upx;
  line-height: 60upx;
  .txt1 {
    font-size: 32upx;
  }
  .txt2 {
    font-size: 46upx;
  }
}

.login_tip {
  color: #9d9d9d;
  margin-top: 20upx;
  margin-bottom: 60upx;
  text-align: center;
  navigator {
    display: inline-block;
  }
}

.nk-btn {
  margin: 50upx;
}
  .btn-text{
    text-align: center;
    background-color: #fff;
  }
</style>
